<template>  
  <div id="app">    
    <app-header :titleShow="true" :qrShow="true"></app-header>    
    <fields :offeredOrderId="false"></fields>
    <tips></tips>        
  </div>
</template>

<script>
  import AppHeader from './components/header.vue'
  import Fields from './components/fields.vue'    
  import Tips from './components/tips.vue'
  export default {    
    components: { AppHeader, Fields, Tips },
    name: 'app'    
  }
</script>

<style lang="less">
  @gradientStart: #acbefe;
  @gradientEnd: #6fcdff;
  @import "./styles/reset.less";
  @import "./styles/basic.less";
  #app {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@gradientStart), to(@gradientEnd));
    background-color: #eee;
    padding: 12px 16px 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
    .orderslist {
      margin: 0 auto;
      width: 94%;
      .list {
        box-shadow: 0px 0px 8px #ccc;
      }
    }
  }
</style>